<template>
  <div v-if="proList && comList">
    <h3>
      婚博会为您找到"<span>{{ $route.query.kw }}</span
      >"的相关结果<span>{{ proList.length + comList.length }}</span
      >个
    </h3>
    <div>
      <company-cell
        v-for="item in comList"
        :key="item.cid"
        :item="item"
      ></company-cell>
    </div>
    <div>
      <product-cell
        v-for="item in proList"
        :key="item.pid"
        :item="item"
      ></product-cell>
    </div>
  </div>
</template>

<script>
import ProductCell from "@/components/ProductCell.vue"
import CompanyCell from "@/components/CompanyCell.vue"
export default {
  data() {
    return {
      proList: null,
      comList: null,
    }
  },
  components: { ProductCell, CompanyCell },
  methods: {
    getSearchPro() {
      const url = "/companys/searchPro?kw=" + this.$route.query.kw
      this.axios.get(url).then((res) => {
        // console.log(res)
        this.proList = res.data.data
      })
    },
    getSearchCom() {
      const url = "/companys/searchCom?kw=" + this.$route.query.kw
      this.axios.get(url).then((res) => {
        console.log(res)
        this.comList = res.data.data
      })
    },
  },
  mounted() {
    this.getSearchPro()
    this.getSearchCom()
  },
  watch: {
    $route() {
      this.getSearchPro()
      this.getSearchCom()
    },
  },
}
</script>

<style lang="scss" scoped>
h3 {
  color: #666;

  span {
    color: #e4464b;
  }
}
</style>
